import Taro, { Component } from "@tarojs/taro";
import { View, Text, Image } from "@tarojs/components";
import { CONTENT_OF_TASK } from '../../service/config'
import {removeCache} from '../../utils/cache'

class Item extends Component {
  render() {
    const { item, index, staticUri,parent } = this.props;
    return (
      <View
        className="product"
        onClick={() => {
          if (!this.props.parent.props.token) {
            this.props.parent.setState({
              isOpened: true
            });
          } else {
            if (item.type === 4) {
              removeCache(CONTENT_OF_TASK)
              Taro.redirectTo({
                url:'/pages/index/sharecontent?id='+item.id+'&puser='+ parent.props.id
              })
            } else {
              Taro.redirectTo({
                url: "/pages/index/task?id=" + item.id + "&type=" + item.type
              });
            }
          }
        }}
      >
        {index === 0 && <View className="product-jiaobiao">精选</View>}
        <Image className="product-img" src={staticUri + item.img} />

        <View className="product-info">
          <View className="product-title">{item.name}</View>
          {item.type === 3 && (
            <View className="product-settlement">
              <View className="click-cpc-money">
                <View className="cpc-money">
                  <View style="font-size:14px;color: #FAA24B;line-height: 20px;">
                    {item.permoney}元
                  </View>
                  <Text style="font-size:12px;color:#151515">/点击</Text>
                </View>
                <View className="settlement-balance">
                  <View className="balance-font">余{item.lastbudget}元</View>
                </View>
              </View>

              <View className="end-time">
                截止日期：{item.etime.substring(0, 10)}
              </View>
            </View>
          )}
          {item.type !== 3 && (
            <View className="product-sub-title">
              {item.subtitle}
            </View>
          )}
          {(item.type === 1 || item.type === 2 || item.type === 4) && (
            <View className="product-money">
              {item.type === 2 && (
                <View className="money">{item.permoney > 10000 ? (item.permoney / 10000) + '万' : item.permoney}</View>
              )}
              <View className="commission">

                {(item.type === 1 || item.type === 2) && (<View style="font-size:14px;">佣金</View>)}
                {item.type === 1 ? item.permoney + "元" : item.type === 2 && (item.perrate * 100) + "%"}
              </View>
            </View>
          )}
        </View>
      </View>
    );
  }
}
export default Item;
